<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <ui:composition template="../../master.xhtml">

        <ui:define name="cabecalho" >
            <!-- css -->
            <style>
                select,input,option{
                    width: 150px;
                }
            </style>

            <!-- jquery -->
            <script>
            $(document).ready(function() {
                // do stuff when DOM is ready
                if(!$(".activarConta2 input").attr("checked"))
                    $(".painelConta2").hide();
                
                $(".activarConta2 input").change(function(){
                    if( $(".activarConta2 input").attr("checked") )
                        $(".painelConta2").show("slow");
                    else
                        $(".painelConta2").hide("slow"); 
                });
            });
            </script>
        </ui:define>

        <ui:define name="menu">
            <ui:include src="../menu.xhtml" /> 
        </ui:define>

        <ui:define name="TituloModulo">Gestão de Financeira</ui:define>

        <ui:define name="TituloConteudoPrincipal">Registar Movimento</ui:define>

        <ui:define name="ConteudoPrincipal">

            <p:messages globalOnly="true"/>
            <h:form>
                <h:panelGrid columns="3">
                    <h:outputText value="Codigo" />
                    <p:spinner id="CodigoDocumento" value="#{movimentoBean.codDoc}" max="5000" min="1" />
                    <p:message for="CodigoDocumento"/> 

                    <h:outputText value="Data" />
                    <p:calendar id="DataDocumento" value="#{movimentoBean.dataDoc}" required="true" locale="pt_BR" navigator="true" readOnlyInputText="true" requiredMessage="#{bundle.obrigatorio}"> 
                        <f:convertDateTime pattern="MM/dd/yyyy" />
                    </p:calendar>
                    <p:message for="DataDocumento"/> 
                </h:panelGrid>

                <p:selectBooleanCheckbox id="conta2" styleClass="activarConta2"  itemLabel="Activar a Segunda" value="#{movimentoBean.conta2}">
                    <p:ajax event="change" />
                </p:selectBooleanCheckbox>

                <h:panelGrid columns="3">
                    <h:outputLabel value="Tipo de Movimento"/>
                    <p:selectOneMenu id="TipoMovimento" value="#{movimentoBean.tipoMov}">
                        <p:ajax event="change" update="TipoMovimento2" />
                        <f:selectItem itemLabel="Débito" itemValue="Debito" />
                        <f:selectItem itemLabel="Crédito" itemValue="Credito" />
                    </p:selectOneMenu>
                    <p:message for="TipoMovimento"/>

                    <h:outputLabel value="Moeda"/>
                    <p:selectOneMenu id="Moeda"   value="#{movimentoBean.idMoeda}" validatorMessage="#{bundle.obrigatorio}" converterMessage="#{bundle.obrigatorio}" requiredMessage="#{bundle.obrigatorio}"  required="true" >
                        <p:ajax event="change" update="TipoConta" listener="#{tipoContaBean.alterarDependencia(movimentoBean.idMoeda)}" />
                        <f:selectItems  value="#{moedaBean.lista}"  />
                    </p:selectOneMenu>
                    <p:message for="Moeda"/>

                    <h:outputLabel value="TipoConta"/>
                    <p:selectOneMenu id="TipoConta" requiredMessage="#{bundle.obrigatorio}"
                                     value="#{tipoContaBean.idTipoConta}"  required="true">
                        <p:ajax event="change" update="Conta" listener="#{contaBean.alterarDependencia(movimentoBean.idMoeda,tipoContaBean.idTipoConta)}" />
                        <f:selectItems value="#{tipoContaBean.lista}" />
                    </p:selectOneMenu>
                    <p:message for="TipoConta"/>

                    <h:outputLabel value="Conta"/>
                    <p:selectOneMenu  id="Conta" requiredMessage="#{bundle.obrigatorio}" value="#{movimentoBean.idConta}" required="true">
                        <f:selectItems value="#{contaBean.lista}" />
                    </p:selectOneMenu>
                    <p:message for="Conta"/>

                    <h:outputText value="Valor"  />
                    <p:spinner id="valorMovimento" requiredMessage="#{bundle.obrigatorio}" required="true" prefix="$" stepFactor="5" value="#{movimentoBean.valorMov}" min="1"  >
                        <p:ajax event="change" update="valorMovimento2"/> 
                    </p:spinner>
                    <p:message for="valorMovimento"/>
                </h:panelGrid>

                <h:panelGrid columns="3"  styleClass="painelConta2" >
                    <h:outputLabel value="Tipo de Movimento"/>
                    <p:inputText id="TipoMovimento2"  readonly="true" value="#{movimentoBean.tipoMov2}"/>
                    <p:message for="TipoMovimento2" />

                    <h:outputLabel value="Moeda"/>
                    <p:selectOneMenu id="Moeda2"  value="#{movimentoBean.idMoeda2}" validatorMessage="#{bundle.obrigatorio}" converterMessage="#{bundle.obrigatorio}" requiredMessage="#{bundle.obrigatorio}"  required="#{movimentoBean.conta2}" >
                        <f:ajax event="change" render="TipoConta2" listener="#{tipoContaBean.alterarDependencia2(movimentoBean.idMoeda2)}" />
                        <f:selectItems  value="#{moedaBean.lista}"  />
                    </p:selectOneMenu>
                    <p:message for="Moeda2"/>

                    <h:outputLabel value="TipoConta"/>
                    <p:selectOneMenu id="TipoConta2" requiredMessage="#{bundle.obrigatorio}"
                                     value="#{tipoContaBean.idTipoConta2}"  required="#{movimentoBean.conta2}">
                        <p:ajax event="change" update="Conta2" listener="#{contaBean.alterarDependencia2(movimentoBean.idMoeda2,tipoContaBean.idTipoConta2)}" />
                        <f:selectItems value="#{tipoContaBean.lista2}" />
                    </p:selectOneMenu>
                    <p:message for="TipoConta2"/>

                    <h:outputLabel value="Conta"/>
                    <p:selectOneMenu id="Conta2" requiredMessage="#{bundle.obrigatorio}" value="#{movimentoBean.idConta2}" required="#{movimentoBean.conta2}">
                        <f:selectItems value="#{contaBean.lista2}" />
                    </p:selectOneMenu>
                    <p:message for="Conta2"/>

                    <h:outputText value="Valor"  />
                    <p:spinner id="valorMovimento2" requiredMessage="#{bundle.obrigatorio}" required="true" prefix="$" stepFactor="5" value="#{movimentoBean.valorMov2}" min="1"  />
                    <p:message for="valorMovimento2"/>
                </h:panelGrid>

                <h:panelGrid columns="3">
                    <h:outputText value="descrição" />
                    <p:inputTextarea id="descricao" value="#{movimentoBean.descr}"/>
                    <h:outputText/>
                </h:panelGrid>

                <h:panelGrid id="botao" columns="3">
                    <p:commandButton value="Guardar" image="ui-icon-disk" action="#{movimentoBean.registar(login)}" ajax="false" />
                    <p:commandButton value="Limpar" ajax="false" type="reset"   /> 
                </h:panelGrid>
            </h:form>
        </ui:define>
    </ui:composition>
</html>

